<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <!-- ## 这个key属性有什么用呢？
                - 确定这个值的存储地址，以方便替换，加快效率
                - 提高性能
            ## 为什么key的值用item，不用index呢？
                - 用index没意义 //TODO
                - 用item的话，item重复，控制台也会报错！
        -->
        <ul>
            <li v-for="item in letters" :key="item"></li>
        </ul>
        <script src="../js/vue.js"></script>
        <script>
            const app = new Vue({
                el: '#app',
                data: {
                    letters: ['a', 'b', 'c', 'd']
                }
            })
        </script>
    </body>
</html>
